
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>layuiAdmin 角色管理</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <link rel="stylesheet" href="../../../layuiadmin/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="../../../layuiadmin/style/admin.css" media="all">
  <link rel="stylesheet" href="../../../static/bootstrap.min.css" media="all">
  <link rel="stylesheet" href="../../../static/style.css" media="all">
  <link rel="stylesheet" href="../../../static/H-ui.min.css" media="all">
  <link rel="stylesheet" href="../../../static/H-ui.admin.css" media="all">
  <link rel="stylesheet" href="../../../static/icheck.css" media="all">
  <link rel="stylesheet" href="../../../static/iconfont.css" media="all">
</head>
<style>
    #form1 input{display:inline-block !important;}
    .permission-list2 dd label{
	    font-weight: 
}
.layui-form-label{width:100px;]}
.permission-list > dd {
    padding: 5px 5px 5px 10px;
}
 </style>
<body>
  <div class="layui-fluid">
    <div class="layui-card">
      <div class="layui-card-body">
        <div style="padding-bottom: 10px;">
          <!--<button class="layui-btn layuiadmin-btn-role layuiadmin-btn-useradmin" data-type="batchdel">删除</button>-->
          <button class="layui-btn layuiadmin-btn-role layuiadmin-btn-useradmin" onclick="add_user()">添加</button>
        </div>
        <table id="LAY-user-back-role" lay-filter="LAY-user-back-role"></table>
      </div>
    </div>
  </div>
 <script src="../../../layuiadmin/layui/layui.js"></script>
   <script src="../../../layuiadmin/layui/layui.all.js"></script>  
   <script src="../../../layuiadmin/config.js"></script>
  <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
  <script>
    layui.use(['table','jquery'], function(){
      var $ = layui.$
              ,form  = layui.form
              ,table = layui.table,
               upload =layui.upload;
      var tableIns = table.render({
        elem: '#LAY-user-back-role',
        url : "{:url('lists')}",
        cellMinWidth : 95,
        page : true,
        height : "full-125",
        limits : [10,40,100,500,1000],
        limit : 10,
        id : "LAY-user-manage",
        cols : [[
          {checkbox: true},
          {field: 'id', title: 'ID', minWidth:50, align:"center"},
          {field: 'topic', title: '题目', minWidth:50, align:"center"},
          {field: 'ble', title: '蓝牙', minWidth:50, align:"center"},
          {field: 'correct', title: '正确答案', minWidth:50, align:"center"},
          {field: 'one', title: 'A的答案', minWidth:50, align:"center"},
          {field: 'two', title: 'B的答案', minWidth:50, align:"center"},
          {field: 'three', title: 'C的答案', minWidth:50, align:"center"},
          {field: 'four', title: 'D的答案', minWidth:50, align:"center"},
          {field: 'live', title: '所在线路', minWidth:50, align:"center"},
          {field: '', title: '操作', align:'center',width:'13%',templet:function(d){
       return    '<a class="layui-btn layui-btn-normal layui-btn-xs layui-btn  tu layuiadmin-btn-useradmin" data-href="edit_show?id='+d.id+'"  data-id="'+d.id+'"   data-target="'+d.topic+'"  onclick="edit(' + d.id+ ',this)">编辑</a>'+
                '<a class="layui-btn layui-bg-black layui-btn-danger layui-btn-xs layui-btn layuiadmin-btn-useradmin" data-id="'+d.id+'" data-type="delete" lay-event="del">删除</a>';
          }},
        ]]
      });
      //监听搜索
      form.on('submit(LAY-user-front-search)', function(data){
        var field = data.field;
        console.log(field);
        //执行重载
        table.reload('LAY-user-manage',{
          url: "{:url('lists?op=table')}",
          where : field,
          done: function(res, curr, count){
            //如果是异步请求数据方式，res即为你接口返回的信息。
            //如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度
            console.log(res);
            //得到当前页码
//                console.log(curr);
            //得到数据总量
//                console.log(count);
          }
        });
      });
     
      //事件
      var active = {
    	next:function(){
    		 table.reload('LAY-user-manage',{
    	          url: "{:url('lists?op=table')}",
    	          where : {pid:$(this).data('id')},
    	          done: function(res,curr,count){
    	            //如果是异步请求数据方式，res即为你接口返回的信息。
    	            //如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度
    	            console.log(res);
    	            //得到当前页码
//    	            console.log(curr);
    	            //得到数据总量
//    	            console.log(count);
    	          }
    	        });
    	},
          show_img:function () {
              var checkStatus = table.checkStatus('LAY-user-manage')
                  ,checkData = checkStatus.data; //得到选中的数据
//              console.log(checkData);return false
              if(checkData.length === 0){
                  ajax_data = $(this).data('id');
              }else {
                  ajax_data=[];
                  $.each(checkData,function(k,v){
                      ajax_data.push(v.id);
                  });
              }
//            console.log(ajax_data);
              $.ajax({
                  type: 'POST',
                  url: '{:url("del")}',
                  data: {id:ajax_data},
                  dataType: 'json',
                  success: function (data){
                      if(data.data==200){
                          table.reload('LAY-user-manage'); //数据刷新
                          layer.closeAll(); //关闭弹层
                          layer.msg(data.msg);
                      }else{
                          layer.msg(data.msg);
                      }
                  }
              });
          },
          //取消显示
          dipy_img:function () {
              var checkStatus = table.checkStatus('LAY-user-manage')
                  ,checkData = checkStatus.data; //得到选中的数据
              if(checkData.length === 0){
                  ajax_data = $(this).data('id');
              }else{
                  ajax_data = [];
                  $.each(checkData,function(k,v){
                      ajax_data.push(v.id);
                  });
              }
//            console.log(ajax_data);
              $.ajax({
                  type: 'POST',
                  url: '{:url("cancelshow")}',
                  data: {id:ajax_data},
                  dataType: 'json',
                  timeout: 3000,
                  success: function (data){
                      if(data.data==200){
                          table.reload('LAY-user-manage'); //数据刷新
                          layer.closeAll(); //关闭弹层
                          layer.msg(data.msg);
                      }else{
                          layer.msg(data.msg);
                      }
                  }
              });
          },

          delete:function () {
            var  id = $(this).data('id');
            console.log(id);
            layer.open({
                title:'删除图片',
                type: 1,
                skin: 'demo-class',
                btn: ['确定', '取消'],
                yes:function (index,lay){
                    $.ajax({
                        type: 'POST',
                        url: "{:url('delete_img')}",
                        data:{id:id} ,
                        dataType: 'json',
                        success: function (res){
                            if(res.data==201){
                                layer.msg(res.msg);
                                table.reload('LAY-user-manage');
                            }
                            if(res){
                                layer.msg(res.msg);
                                layer.close(index);
                                table.reload('LAY-user-manage');
                            }
                        }
                    })
                }
            });
        }
        //显示图片
        ,batchdel: function(){
              var checkStatus = table.checkStatus('LAY-user-manage')
                  ,checkData = checkStatus.data; //得到选中的数据
//              console.log(checkData);return false
              if(checkData.length === 0){
                  ajax_data = $(this).data('id');
              }else {
                  ajax_data=[];
                  $.each(checkData,function(k,v){
                       ajax_data.push(v.id);
                  });
              }
//            console.log(ajax_data);
              $.ajax({
            		type: 'POST',
    	            url: '{:url("del")}',
    	            data: {id:ajax_data},
    	            dataType: 'json',
    	            success: function (data){
    	         	   if(data.data==200){
    	         		  table.reload('LAY-user-manage'); //数据刷新
    	                  layer.closeAll(); //关闭弹层
    	                  layer.msg(data.msg);
    	         	   }else{
    	         	      layer.msg(data.msg);
    	         	   }
    	            }
            	});
        }
        //取消显示
        ,cancelshow:function(){
              var checkStatus = table.checkStatus('LAY-user-manage')
                  ,checkData = checkStatus.data; //得到选中的数据
              if(checkData.length === 0){
                  ajax_data = $(this).data('id');
              }else{
                  ajax_data = [];
                  $.each(checkData,function(k,v){
                      ajax_data.push(v.id);
                  });
              }
//            console.log(ajax_data);
              $.ajax({
                  type: 'POST',
                  url: '{:url("cancelshow")}',
                  data: {id:ajax_data},
                  dataType: 'json',
                  timeout: 3000,
                  success: function (data){
                      if(data.data==200){
                          table.reload('LAY-user-manage'); //数据刷新
                          layer.closeAll(); //关闭弹层
                          layer.msg(data.msg);
                      }else{
                          layer.msg(data.msg);
                      }
                  }
              });
        }
        ,add: function(){
//              var checkStatus = table.checkStatus('LAY-user-manage')
//                  ,checkData  = checkStatus.data; //得到选中的数据
//              if(checkData.length === 0){
//                  return layer.msg('请选择数据');
//              }
//              ajax_data = [];
//              $.each(checkData,function(k,v){
//                  ajax_data.push(v.id);
//                  id= v.id
//              });
              var id =   $(this).data('id');
              content =
                  '<div class="layui-form" lay-filter="layuiadmin-form-role" id="layuiadmin-form-role" style="padding: 20px 30px 0 0;">'+
                  '<form id="form1">' +
                  '<input type="hidden" name="id" class="imgInput" value='+id+' id="img_src" placeholder="" name="img_src">'+
                  '<input type="file" value="" id="img_src" placeholder="" name="img_src">'+
                  '</form>'+
                  '</div>';
              layer.open({
                  content:content,
                  title:'更换图片',
                  type: 1,
                  area: ['250px', '150px']
                  ,maxmin: true
                  ,btn: ['确定', '取消']
                  ,yes:function (index,lay){
                      var formData= new FormData(document.getElementById("form1"));
                      $.ajax({
                          type: 'POST',
                          url: "{:url('update_img')}",
                          data: formData,
                          dataType: 'json',
                          timeout: 3000,
                          cache: false,
                          contentType: false,
                          processData: false,
                          success: function (res){
                              if(res.data==201){
                                  layer.msg(res.msg);
                                  table.reload('LAY-user-manage');
                              }
                              if(res){
                                  layer.msg(res.msg);
                                  layer.close(index);
                                  table.reload('LAY-user-manage');
                              }
                          }
                      })
                  }
              });
        },
        addImg:function (){
            var swich_this = 1;
            content =
            '<div class="layui-form" lay-filter="layuiadmin-form-role" id="layuiadmin-form-role" style="padding: 20px 30px 0 0;">'+
               '<form id="form1">' +
                  '<div class="layui-form-item">'+
                    '<input type="text" name="name"  placeholder="备注" class="layui-input">'+
                                '<input type="text" placeholder="图片url" name="logo_url"  class="layui-input">'+
                            '<div class="layui-col-md6">' +
                                  '<select class="layui-select" style="display: block"    name="type" lay-verify="">'+
                                          '<option value="">请选择一个类型</option>' +
                                          '<option value="1">首页顶部</option>' +
                                          '<option value="2">首页中部</option>' +
                                          '<option value="3">商城顶部banner</option>' +
                                          '<option value="4">商城中部banner</option>' +
                                  '</select>' +
                            '</div>'+
                '<input type="file" class="imgInput" value="" id="img_src" placeholder="" name="img_src">'+
                  '</div>'+
               '</form>'+
            '</div>';
if(swich_this==1){
	swich_this++;
	var swich_post=1;
    layer.open({
        title:'添加图片',
        content:content,
        type: 1,
        area: ['700px', '420px']
        ,maxmin: true
        ,btn: ['确定', '取消']
        ,yes:function (index,lay){
//          $(this).attr('disabled',false);
            var formData= new FormData(document.getElementById("form1"));
            if(swich_post==1){
            	swich_post++;
            	 $.ajax({
                     type: 'POST',
                     url: "{:url('upload_img')}",
                     data: formData,
                     dataType: 'json',
                     timeout: 3000,
                     cache: false,
                     contentType: false,
                     processData: false,
                     success: function (res){
                         if(res.data==201){
                             layer.msg(res.msg);
                             swich_this = 1;
                             swich_post = 1;
                         }else if(res){
                        	 layer.close(index);
                             table.reload('LAY-user-manage');
                             swich_this = 1;
                             swich_post = 1;
                             layer.msg(res.msg);
                         }
                     }
                 })
            }
           
        }
    });
    upload.render({
        elem: '#test-upload-change',
        url: '{:url("upload_img")}',
        auto: false,
//                bindAction: '#test-upload-change-action',
        done: function(res){
            console.log(res)
        },
        error:function (index,upload){

        }
    });
}
        }
      };

      $('body').on('click','.layui-btn.layuiadmin-btn-useradmin', function(){
        var type = $(this).data('type');
        active[type] ? active[type].call(this) : '';
      });

      $(".permission-list dt input:checkbox").click(function (){
          $(this).closest("dl").find("dd input:checkbox").prop("checked", $(this).prop("checked"));
          if ($(this).prop("checked")){
              $(this).parents(".permission-list").find("dt").first().find("input:checkbox").prop("checked", true);
          }
      });
      $("body").on('click','.permission-list2 dd input:checkbox',function (){
          var l = $(this).parent().parent().find("input:checked").length;
          var l2 = $(this).parents(".permission-list").find(".permission-list2 dd").find("input:checked").length;
          if ($(this).prop("checked")){
              $(this).closest("dl").find("dt input:checkbox").prop("checked", true);
              $(this).parents(".permission-list").find("dt").first().find("input:checkbox").prop("checked", true);
          } else {
              if (l == 0) {
                  $(this).closest("dl").find("dt input:checkbox").prop("checked", false);
              }
              if (l2 == 0) {
                  $(this).parents(".permission-list").find("dt").first().find("input:checkbox").prop("checked", false);
              }
          }
      });
    	  $("body").on('click','.check_rule_0',function (){
              if ($(this).prop("checked")){
            	  $(this).parents('dl').find('.check_rule_1').prop("checked", true);$(this).parents('dl').find('.check_rule_2').prop("checked", true);
              } else {
            	  $(this).parents('dl').find('.check_rule_1').prop("checked", false);$(this).parents('dl').find('.check_rule_2').prop("checked", false);
              }
          });
    	  $("body").on('click','.check_rule_1',function (){
              if ($(this).prop("checked")){
                 $(this).parents('dl.permission-list2').find('.check_rule_2').prop("checked", true);
              }else{
            	 $(this).parents('dl.permission-list2').find('.check_rule_2').prop("checked", false);
              }
          });
    });

    function show($id, obj) {
        layer.open({
            title: $(obj).attr('data-target') + '的详情',
            type: 2,
            content: $(obj).attr('data-href'),
            maxmin: true,
            area: ['60%', '90%']
        })
    }

    function edit($id, obj) {
        layer.open({
            title: $(obj).attr('data-target') + '编辑数据',
            type: 2,
            content: $(obj).attr('data-href'),
            maxmin: true,
            area: ['60%', '90%']
        })
    }

    function add_user(id) {
        event.preventDefault();
        layer.open({
            type: 2
            ,title: '添加问题'
            ,content: "{:url('add')}"
            ,maxmin: true
            ,area: ['40%', '80%']
        })
    }

  </script>
</body>
</html>

